<template>
  <div class="employee-container">
    <el-row>
      <el-breadcrumb separator="/">
        <el-breadcrumb-item>首页</el-breadcrumb-item>
        <el-breadcrumb-item>仓库管理系统</el-breadcrumb-item>
        <el-breadcrumb-item>商品管理</el-breadcrumb-item>
      </el-breadcrumb>
    </el-row>
    <el-row>
      <el-form label-width="80px">
        <el-row>
          <el-col :span="8">
            <el-form-item label="搜索" label-width="80px">
              <el-input></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item label="价格范围" label-width="80px">
              <el-input></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="8">
            <el-form-item>
              <el-button type="success">搜索</el-button>
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </el-row>
    <el-row>
      <el-table
        :data="tableData"
        border
        stripe
        style="width: 100%">
        <el-table-column
          prop="num"
          label="商品编号"
          width="180">
        </el-table-column>
        <el-table-column
          prop="name"
          label="商品名称">
        </el-table-column>
        <el-table-column
          prop="price"
          label="商品价格"
          sortable>
        </el-table-column>
        <el-table-column
          prop="repertory"
          label="商品库存">
        </el-table-column>
        <el-table-column
          prop="introduction"
          label="商品简介"
          width="400">
        </el-table-column>
      </el-table>
      <el-pagination
        small
        layout="prev,pager,next"
        :total="50">
      </el-pagination>
    </el-row>
  </div>
</template>

<script>
  export default {
    name: "Employee", data(){
      return{
        tableData:[]
      }
    },mounted() {
      /*挂载结束之后*/
      var _this=this;
      this.axios({
        url:'http://localhost:3000/dict/list',
        method:'get'
      }).then(function (res) {
        _this.tableData=res.data;
      })
    }
  }
</script>

<style scoped>

</style>
